<head>
    <link rel="stylesheet" href="../reset.css">
</head>

<style>
    body{
        border: 5px solid orange;
    }
    .father{
        width: 600px;
        height: 400px;
        border: 2px solid purple;
        margin-left: 50px;
        position: relative;
    }
    .son{
        width: 200px;
        height: 200px;
        background-color: blanchedalmond;
        position: absolute; 
        left: 30px;
    }
    .grandson{
        width: 100px;
        height: 100px;
        background-color: aqua;
        position: absolute;
        left: 30px;
    }

</style>

<body>
    <div class="father">
        <div class="son">
            son
            <div class="grandson">
                孙子
            </div>
        </div>
    </div>

    <div style="width: 700px;height:600px;background-color: rgb(240, 233, 233);">1111111</div>

</body>